<template>
  <div>
    我是子组件
    {{ house }}
  </div>

  <button @click="handleClick">click me!</button>
</template>

<script setup lang="ts">
// 非TS语法
// defineProps({
//   house: {
//     type: String,
//     requied: true
//   }
// })

// TS语法
type PropsType = {
  house?: string
}

// defineProps<{
//   house: string
// }>()
// const props = defineProps<PropsType>()
// const { house = '茅草屋' } = props

withDefaults(defineProps<PropsType>(), {
  house: '茅草屋'
})



// ---------------------------------------------------------------

// 非TS语法
// const emit = defineEmits(['getGift'])

// const handleClick = () => {
//   // 子传父组件参数
//   emit('getGift','孙子')
// }

// TS语法
const emit = defineEmits<{
  (e: 'getGift', gift: string,msg:string): void
}>()
const handleClick = () => {
  // 子传父组件参数
  emit('getGift','孙子','hello')
}
</script>

<style scoped></style>